<template>
    <div style="background-color: white;margin-top: 46px;text-align: center">
        <router-link to="login">
            <van-nav-bar fixed="true" left-text="返回" left-arrow></van-nav-bar>
        </router-link>
        <van-cell-group>
            <div>
                <span >选择律师头像</span>
            </div>
            <van-radio-group v-model="radio" direction="horizontal" style="justify-content: center">
                <van-radio name="../../static/images/nan.png" icon-size="24px"><img src="../../static/images/nan.png" width="50" height="50" style="border-radius: 50%"></van-radio>
                <van-radio name="../../static/images/nv.png" icon-size="24px"><img src="../../static/images/nv.png" width="50" height="50" style="border-radius: 50%"></van-radio>
            </van-radio-group>
            <van-field
                    label-align="right"
                    readonly
                    clickable
                    name="picker"
                    :value="value"
                    label="律师类别"
                    placeholder="点击选择律师类别"
                    @click="showPicker = true"
            />
            <van-popup v-model="showPicker" position="bottom">
                <van-picker
                        show-toolbar
                        :columns="columns"
                        @confirm="onConfirm"
                        @cancel="showPicker = false"
                />
            </van-popup>
            <van-field
                    style="margin-top: 10px"
                    v-model="lawyername"
                    required
                    label="用户名"
                    placeholder="请输入用户名"
            />
            <van-field
                    v-model="lawyersex"
                    required
                    label="性别"
                    placeholder="请输入性别"
            />
            <van-field
                    v-model="lawyerage"
                    required
                    label="年龄"
                    placeholder="请输入年龄"
            />
            <van-field
                    v-model="lawyernumber"
                    required
                    label="账号"
                    placeholder="请输入账号"
            />
            <van-field
                    v-model="pwd"
                    required
                    label="密码"
                    placeholder="请输入密码"
            />
        </van-cell-group>
            <van-button @click="lawyerRegister" style="margin-top: 10px" size="small" color="linear-gradient(to right, #4bb0ff, #6149f6)" round
                        type="info">确认注册
            </van-button>

    </div>
</template>

<script>
    export default {
        data(){
            return{
                name: "lawyerRegister",
                showPicker: false,
                value:'',
                radio:'',
                columns: ['行政律师', '经济律师', '民事律师','刑事律师'],
                lawyername:'',
                lawyersex:'',
                lawyerage:'',
                lawyernumber:'',
                pwd:''
            }
        },

        methods:{
            onConfirm(value) {
                this.value = value;
                this.showPicker = false;
            },
            lawyerRegister(){
                console.log(this.radio)
                console.log(this.value)
                console.log(this.lawyername)
                console.log(this.lawyersex)
                console.log(this.lawyerage)
                console.log(this.lawyernumber)
                console.log(this.pwd)
                this.$axios.post("/lawyer/lawyerRegister",{
                    "lawLawyerName":this.lawyername,
                    "lawLawyerSex":this.lawyersex,
                    "lawLawyerAge":this.lawyerage,
                    "lawLawyerKind":this.value,
                    "lawLawyerNumber":this.lawyernumber,
                    "lawLawyerPwd":this.pwd,
                    "lawImage":this.radio,
                },
                res =>{
                    console.log(res)
                    if (!this.lawyernumber){
                        this.$toast.fail('必须填写账号!')
                    }else if (!this.pwd){
                        this.$toast.fail('必须填写密码！')
                    }else if (!this.lawyername){
                        this.$toast.fail('必须填写用户名！')
                    }else if (!this.lawyersex){
                        this.$toast.fail('必须填写性别！')
                    }else if (!this.lawyerage){
                        this.$toast.fail('必须填写年龄！')
                    }else if (!this.value){
                        this.$toast.fail('必须选择律师类别！')
                    }else if (!this.radio){
                        this.$toast.fail('必须选择头像！')
                    }else if (res.data.success){
                        this.$router.push('/login')
                        this.$toast.success('注册成功，请登录！')
                    }else {
                        this.$toast(res.data.message)
                    }
                }
                )
            }
        }
    }

</script>

<style scoped>

</style>
